import 'package:flutter/material.dart';
import 'package:flutter_swiper/flutter_swiper.dart';
import 'package:qgchat/bloc/blocProvider.dart';
import 'package:qgchat/bloc/my/AnchorInfoBloc.dart';
import 'package:qgchat/common/global/global.dart';
import 'package:qgchat/http/models/anchorInfoModel.dart';
import 'package:qgchat/http/models/tagModel.dart';
import 'package:qgchat/widgets/appbarCustom.dart';
import 'package:qgchat/widgets/line.dart';

/*
 * 认证信息页面
 * page认证信息
 */

class AttestationInfo extends StatefulWidget {
  @override
  _AttestationInfoState createState() => _AttestationInfoState();
}

class _AttestationInfoState extends State<AttestationInfo> {
  final blog = AnchorInfoBloc();

  // 轮播图List
  List<Image> imgList = [];

  @override
  void initState() {
    super.initState();
  }

  // 修改
  void _modification() {
    goPage(context, '/anchorAuth');
  }

// -----------------------------------------------------------------------------

  /// appbar
  Widget appBar() {
    return AppbarCustom(
      '认证信息',
      rightText: '修改',
      rightOnPressed: _modification,
    );
  }

  /// 轮播
//  Widget swiperWidget() {
////    return
////  }

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      bloc: blog,
      child: Scaffold(
          appBar: appBar(),
          body: Container(
              child: SingleChildScrollView(
                  physics: BouncingScrollPhysics(),
                  child: SafeArea(
                    bottom: true,
                    child: Column(
                      children: <Widget>[
                        _SwiperWidget(bloc: blog),
                        _PrivateInfo(),
                      ],
                    ),
                  )))),
    );
  }
}

/// 轮播
class _SwiperWidget extends StatelessWidget {
  _SwiperWidget({Key key, this.bloc}) : super(key: key);
  final bloc;

  // 点击当前轮播图
  void _swiperItemClick(int index) {
    print('当前第${index + 1}个轮播图被点击');
  }

  // 相机按钮被点击
  void _cameraClick() {
    print('照相机被点击');
  }

  @override
  Widget build(BuildContext context) {
    final AnchorInfoBloc bloc = BlocProvider.of<AnchorInfoBloc>(context);
    String memberToken = state(context, 'user').info.memberToken;
    bloc.getAnchorInfo(memberToken);

    return StreamBuilder<AnchorInfoModel>(
      stream: bloc.outAnchorInfoStream,
      initialData: null,
      builder: (BuildContext context, AsyncSnapshot<AnchorInfoModel> snapshot) {
        if (snapshot.data != null) {
          List imgList = snapshot.data.anchorImg.replaceAll('[', '')
            .replaceAll(']', '').replaceAll('\\', '').replaceAll('"', '')
            .split(',');
            print(imgList);
          return Container(
              height: px(750),
              child: Stack(
                alignment: Alignment.topRight,
                children: <Widget>[
                  Swiper(
                    onTap: (int index) {
                      _swiperItemClick(index);
                    },
                    itemCount: imgList.length,
                    itemBuilder: (BuildContext context, int index) {
                      return Image.network(
                        imgList[index],
                        fit: BoxFit.cover,
                      );
                    },
                    pagination: SwiperCustomPagination(builder:
                        (BuildContext context, SwiperPluginConfig config) {
                      return Align(
                        alignment: Alignment.bottomCenter,
                        child: Container(
                          width: px(92),
                          height: px(54),
                          margin: EdgeInsets.only(bottom: px(25)),
                          alignment: Alignment.center,
                          decoration: BoxDecoration(
                              color: Colors.black.withOpacity(0.32),
                              borderRadius: BorderRadius.circular(px(27))),
                          child: Text(
                            '${config.activeIndex + 1}/${imgList.length}',
                            style: TextStyle(
                                fontSize: px(26), color: col('ffffff')),
                          ),
                        ),
                      );
                    }),
                  ),
                  Container(
                    width: px(100),
                    height: px(100),
                    child: FlatButton(
                        onPressed: _cameraClick,
                        shape: RoundedRectangleBorder(
                            borderRadius:
                                BorderRadius.all(Radius.circular(px(50)))),
                        child: Container(
                          width: px(44),
                          height: px(40),
                          child: Image.asset('assets/images/icon/camera.png'),
                        )),
                  )
                ],
              ));
        } else {
          return Container(
            height: px(750),
          );
        }
      },
    );
  }
}

/// 私人信息
class _PrivateInfo extends StatelessWidget {
  _PrivateInfo({Key key}) : super(key: key);

  /// 私人信息标题
  Widget privateInfo() {
    return Container(
      margin: EdgeInsets.only(top: px(50)),
      padding: EdgeInsets.symmetric(horizontal: px(30)),
      child: Text(
        '私人信息',
        style: TextStyle(
            fontSize: px(44),
            color: col('303133'),
            height: 1,
            fontWeight: FontWeight.bold),
      ),
    );
  }

  /// 私人信息子项
  Widget infoItem(String k, String v) {
    return Container(
//      width: w100(context),
      height: px(180),
      padding: EdgeInsets.symmetric(horizontal: px(42)),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Container(
            margin: EdgeInsets.only(top: px(50)),
            child: Text(
              k,
              style:
                  TextStyle(fontSize: px(26), color: col('909399'), height: 1),
            ),
          ),
          Container(
            margin: EdgeInsets.only(top: px(25)),
            child: Text(
              v,
              style:
                  TextStyle(fontSize: px(34), color: col('303133'), height: 1),
            ),
          ),
        ],
      ),
    );
  }

  /// 形象标签
  Widget tagsItem(String id, BuildContext context) {
    final AnchorInfoBloc bloc = BlocProvider.of<AnchorInfoBloc>(context);
    bloc.getTag(id);

    return StreamBuilder<TagModel>(
      stream: bloc.outTagStream,
      initialData: null,
      builder: (BuildContext context, AsyncSnapshot<TagModel> snapshot) {
        if (snapshot.data != null) {
          return Container(
            height: px(124),
            padding: EdgeInsets.symmetric(horizontal: px(42)),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                Container(
                  child: Text(
                    '形象标签',
                    style: TextStyle(
                        fontSize: px(26), color: col('909399'), height: 1.2),
                  ),
                ),
                Container(
                  child: Row(
                    children: <Widget>[
                      _tag(snapshot.data.tagName),

                      /// 右箭头
                      Container(
                        height: px(26),
                        margin: EdgeInsets.only(left: px(10)),
                        child: Image.asset('assets/images/icon/right.png'),
                      )
                    ],
                  ),
                )
              ],
            ),
          );
        } else {
          return Container();
        }
      },
    );
  }

  /// 标签
  Widget _tag(String tagText) {
    return Container(
      height: px(54),
      alignment: Alignment.center,
      padding: EdgeInsets.symmetric(horizontal: px(21)),
      margin: EdgeInsets.only(right: px(15)),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(px(27)),
        color: col('6f53ff'),
      ),
      child: Text(
        tagText,
        style: TextStyle(fontSize: px(26), color: col('fefefe'), height: 1.2),
      ),
    );
  }

  /// 个性签名
  Widget signature(String signatureText) {
    return Container(
//      width: w100(context),
      height: px(124),
      padding: EdgeInsets.symmetric(horizontal: px(42)),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          Container(
            child: Text(
              '个性签名',
              style: TextStyle(
                  fontSize: px(26), color: col('909399'), height: 1.2),
            ),
          ),
          Container(
            child: Row(
              children: <Widget>[
                Container(
                  width: px(434),
                  child: Text(
                    signatureText,
                    maxLines: 1,
                    overflow: TextOverflow.ellipsis,
                    style: TextStyle(fontSize: px(26), color: col('909090')),
                  ),
                ),

                /// 右箭头
                Container(
                  height: px(26),
                  margin: EdgeInsets.only(left: px(10)),
                  child: Image.asset('assets/images/icon/right.png'),
                )
              ],
            ),
          )
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    final AnchorInfoBloc bloc = BlocProvider.of<AnchorInfoBloc>(context);

    return StreamBuilder<AnchorInfoModel>(
      stream: bloc.outAnchorInfoStream,
      initialData: null,
      builder: (BuildContext context, AsyncSnapshot<AnchorInfoModel> snapshot) {
        if (snapshot.data != null) {
          AnchorInfoModel data = snapshot.data;
          return Container(
            padding: EdgeInsets.symmetric(horizontal: px(30)),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                privateInfo(),
                infoItem('身高', data.anchorHeight),
                Line(),
                infoItem('体重', (data.anchorWeight).toString()),
                Line(),
                infoItem('星座', data.anchorStar),
                Line(),
                infoItem('所在城市', data.anchorCity),
                Line(),
                tagsItem(data.anchorTag, context),
                Line(),
                signature(data.anchorSign),
              ],
            ),
          );
        } else {
          return Container();
        }
      },
    );
  }
}
